/*
 * 用于 Zhihu Android WebView Reader
 *
 * 依赖:
 * zepto.min.js
 * moment.min.js
 * lazyload.js
 * image.js
 * link-box.js
 * video-box.js
 * share.js
 * wrapper.js
 *
 * native 需要实现的接口有:
 * void onClickBody();
 * void onDocumentReady();
 * int providePaddingTop()
 * int providePaddingBottom()
 * String provideContent();
 * int provideBodyFontSize();
 * int provideTitleFontSize();
 * void onReaderATagClick(String url);
 *
 * native 可以调用的方法有:
 * void setBodyFontSize(int fontSize);
 * void setTitleFontSize(int fontSize);
 * void setContentMinHeight(int minHeight);
 * void setContentOffset(int offset);
 * void setContentVisible(boolean visible);
 * void setupTheme();
 */

function setBodyFontSize(fontSize) {
	$('body').css('font-size', fontSize + 'px');
}

function setTitleFontSize(fontSize) {
	$('div').each(function() {
		var that = $(this);
		if (that.hasClass('title')) {
			that.css('font-size', fontSize + 'px');
		}
	});
}

function setContentMinHeight(minHeight) {
	$('#content').css('min-height', minHeight + 'px');
}

// 一定要保证 window 的高度 >= offset 才会生效
function setContentOffset(offset) {
	window.scrollTo(0, offset);
}

function setContentVisible(visible) {
	if (visible) {
		$('#content').css('visibility', 'visible');
	} else {
		$('#content').css('visibility', 'hidden');
	}
}

function onCharge(){
    ReaderBridge.onCharge();
}

function onChargeRank(){
    ReaderBridge.onChargeRank();
}
// =================================================================================================

function buildContentFromArticle(json) {
	var article = JSON.parse(json);
	var title='';
	var time='';
	var charge='';
    var avatar='';
	var chareNum='';
	if(article.summary!=null&&article.summary!=''){
	    title = buildTitleTag(article.summary);
	}
	if(article.time!=null&&article.time!=''){
        time=buildTime(article.time);
	}
	var chargeUserCount=article.chargeUserCount;
	for(var i=0;i<chargeUserCount;i++){
	    var propertyName="avatar"+i;
	    avatar=avatar+ buildChargeAvatar(article[propertyName]);
	}
	var totalChargeNum=article.totalChargeNum;
	if(totalChargeNum<=3){
         chareNum=buildSmallChargeNum(chargeUserCount);
	}else{
	     chareNum=buildLargeChargeNum(totalChargeNum);
	}
	if(article.charge!=null&&article.charge!=''){
        charge=buildCharge(article.charge,avatar,chareNum,totalChargeNum<=0);
    }

	var content = article.content != null ? article.content : '';
	return title + content + time + charge;

}

function buildTitleTag(title) {
	return $('<div />', {'class': 'summary', 'text': title})[0].outerHTML;
}

function buildTime(time) {
	return $('<div />', {'class': 'time', 'text': time})[0].outerHTML;
}

function buildCharge(chargeDesc,avatars,totalChargeNum,hideAvatarAndNum) {
    chargeDesc='“'+chargeDesc+'”';
    if(hideAvatarAndNum){
        return  '<p class="charge_des">'+chargeDesc+'</p><div class="charge_logo" onclick="onCharge()"/>';
    }
	return '<p class="charge_des">'+chargeDesc+'</p><div class="charge_logo" onclick="onCharge()"/><div class="avatars" onclick="onChargeRank()">'+avatars+totalChargeNum+'</div>';
}

function buildChargeAvatar(avatar){
      return '<div class="avatar_out"><a href="" class="avatar" onclick="return false;">'+$('<img />',{'src':avatar,'alt':'','class':'charge_user_avatar'})[0].outerHTML+'</a></div>';
}

function buildLargeChargeNum(num){
    return  $('<div />', {'class': 'charge_more', 'text': '+'+num})[0].outerHTML;
}

function buildSmallChargeNum(num){
    return '<p class="charge_word">'+$('<span />',{'text':num})[0].outerHTML+'人已投喂</p>';
}


// =================================================================================================
setContentPaddingTop(ReaderBridge.providePaddingTop());
setContentPaddingBottom(ReaderBridge.providePaddingBottom());
setContentPaddingLeft(16);
setContentPaddingRight(16);

var bodyFontSize = ReaderBridge.provideBodyFontSize();
var titleFontSize = ReaderBridge.provideTitleFontSize();
setBodyFontSize(bodyFontSize);
setTitleFontSize(titleFontSize);

var content = ReaderBridge.provideContent();
content = buildContentFromArticle(content);
$('#content').append(content);

setupImage(true);

$(document).ready(function() {
	$('body').click(function(event) {
		var tag = event.target.tagName.toLowerCase();
		if (tag != 'a' && tag != 'img' && tag != 'time') {
			ReaderBridge.onClickBody();
		}
	});

	setContentVisible(true);
	ReaderBridge.onDocumentReady();
});